/**
 * 获取视频元素
 */
const video = document.getElementById('video');
/**
 * 获取主画布元素
 */
const canvas = document.getElementById('canvas');
/**
 * 获取主画布的 2D 绘图上下文，设置为频繁读取模式
 */
const canvasCtx = canvas.getContext('2d', { willReadFrequently: true });
/**
 * 获取视频容器元素
 */
const videoContainer = document.getElementById('videoContainer');
/**
 * 获取画布包装器元素
 */
const canvasWrapper = document.getElementById('canvasWrapper');
/**
 * 获取开始按钮元素
 */
const startBtn = document.getElementById('startBtn');
/**
 * 获取截图按钮元素
 */
const captureBtn = document.getElementById('captureBtn');
/**
 * 获取下载按钮元素
 */
const downloadBtn = document.getElementById('downloadBtn');
/**
 * 获取撤销按钮元素
 */
const undoBtn = document.getElementById('undoBtn');
/**
 * 获取截图工具卡片元素
 */
const screenshotToolCard = document.getElementById('screenshotToolCard');
/**
 * 获取绘图画布元素
 */
const drawCanvas = document.getElementById('drawCanvas');
/**
 * 获取绘图画布的 2D 绘图上下文，设置为频繁读取模式
 */
const drawCtx = drawCanvas.getContext('2d', { willReadFrequently: true });
/**
 * 获取预览画布元素
 */
const previewCanvas = document.getElementById('previewCanvas');
/**
 * 获取预览画布的 2D 绘图上下文，设置为频繁读取模式
 */
const previewCtx = previewCanvas.getContext('2d', { willReadFrequently: true });
/**
 * 获取矩形工具按钮元素
 */
const rectTool = document.getElementById('rectTool');
/**
 * 获取画笔工具按钮元素
 */
const drawTool = document.getElementById('drawTool');
/**
 * 获取直线工具按钮元素
 */
const lineTool = document.getElementById('lineTool');
/**
 * 获取圆形工具按钮元素
 */
const circleTool = document.getElementById('circleTool');
/**
 * 获取文本工具按钮元素
 */
const textTool = document.getElementById('textTool');
/**
 * 获取箭头工具按钮元素
 */
const arrowTool = document.getElementById('arrowTool');
/**
 * 获取所有线条颜色选项元素
 */
const colorOptions = document.querySelectorAll('.line-color');
/**
 * 获取所有线条粗细选项元素
 */
const sizeOptions = document.querySelectorAll('.line-size');
